<!DOCTYPE html>
<html>

	<head>
		<link rel="stylesheet" href="<?php echo APP_TEMPLATES_URL;?>/css/public.css" />
		<link rel="stylesheet" href="<?php echo APP_TEMPLATES_URL;?>/css/mui.min.css">
		<script src="<?php echo APP_TEMPLATES_URL;?>/js/mui.min.js"></script>
		<script type="text/javascript" src="<?php echo APP_SITE_URL;?>/js/zepto.min.js"></script>
		<script type="text/javascript" src="<?php echo APP_SITE_URL;?>/js/template.js"></script>

		<style>
			.indexm{ display: block !important;}
			.height44 {height: 44px !important;}
		</style>

	</head>

	<body style="padding-bottom: 16px;">

		<!-- 导航 -->
		<div class="mui-bar mui-bar-nav bj">
			<a href="<?php echo urlApp(); ?>">
			<button id="zhuce" class="mui-btn mui-btn-link mui-btn-nav mui-pull-left zys">
				<img style=" max-width: 70%; vertical-align: middle;" src="<?php echo APP_TEMPLATES_URL;?>/images/back.png" />
			</button></a>

			<h1 class="mui-title"><label style="font-size: 18px;vertical-align: middle; line-height: 44px;">发现</label></h1>
		</div>

		<!--
            	作者：offline
            	时间：2016-11-17
            	描述：发现
        -->

		<div class="mui-content">
			<div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="top:40px;background-color: #FFFFFF;">
				<div class="mui-scroll">

					<table class="tablecolor" width="100%" id="find_list">
						<?php foreach ($output['article_list'] as $value) { ?>
						<tr>
							<td style="table-layout: auto;">
								<div style="height: 15px; background: #F4F4F4; clear: both;"></div>

								<div style="margin-bottom: -140px;    float: left;    position: relative; z-index: 3;   width: 100%;    height: 0px;">
									<p style="background: url('<?php echo APP_TEMPLATES_URL;?>/images/find_02-9.png') no-repeat left; margin-top: 15px; float: left; width: 73px; padding-left: 5px;    background-size: cover;
			color: #000000;"><?php echo $value['class_name'];?></p>
									<div style="margin-top: 20%;color: #FFFFFF; text-align: center; width: 100%; clear: both;">
										<a href="index.php?act=find&op=information_particulars&article_id=<?php echo $value['article_id'];?>">
										<p style="font-size: 22px; font-weight: bold;"><?php echo $value['article_title'];?></p>
										<p><?php echo $value['article_title_short'];?></p>
										</a>
									</div>
								</div>
								<a href="index.php?act=find&op=information_particulars&article_id=<?php echo $value['article_id'];?>">
									<img style="width: 100%;" src="<?php if(!$value['article_image']){echo APP_TEMPLATES_URL.'/images/find2_02.jpg';}else{$image=unserialize($value['article_image']);
									echo UPLOAD_SITE_URL.'/'.DIR_CMS.'/'.'article'.'/'.$image['path'].'/'.$image['name'];}?>" />
									<img style="width: 100%; position: relative; z-index: 2; float:left; margin-top: -61.5%; " src="templates/default/images/cccc_03.png" />
								</a>
								<div style="clear: both;"></div>
								<p style="position: relative; z-index: 18;padding-left: 20px;margin-top: -35px;">
									<img src="<?php echo APP_TEMPLATES_URL;?>/images/find_06-10.png"><label style="color: #FFFFFF;"><?php echo $value['article_click'];?></label>
								</p>
							</td>
						</tr>
						<?php } ?>
					</table>

				</div>
			</div>
		</div>

		<div style="height: 0px; background: #F4F4F4; clear: both;"></div>


<script type="text/html" id="record-list">
	<%
	if(article_list.length >0){
	for (var i = 0;i<article_list.length;i++){
	%>
	<tr>
		<td style="table-layout: auto;">
			<div style="height: 15px; background: #F4F4F4; clear: both;"></div>

			<div style="margin-bottom: -140px;    float: left;    position: relative; z-index: 3;   width: 100%;    height: 0px;">
				<p style="background: url('<?php echo APP_TEMPLATES_URL;?>/images/find_02-9.png') no-repeat left; margin-top: 15px; float: left; width: 73px; padding-left: 5px;    background-size: cover;
					color: #000000;"><%=article_list[i].class_name%></p>
				<div style="margin-top: 20%;color: #FFFFFF; text-align: center; width: 100%; clear: both;">
					<a href="index.php?act=find&op=information_particulars&article_id=<%=article_list[i].article_id%>">
						<p style="font-size: 22px; font-weight: bold;"><%=article_list[i].article_title%></p>
						<p><%=article_list[i].article_title_short%></p>
					</a>
				</div>
			</div>
			<a href="index.php?act=find&op=information_particulars&article_id=<%=article_list[i].article_id%>">
				<img style="width: 100%;" src="<%=article_list[i].show_img%>" />
				<img style="width: 100%; position: relative; z-index: 2; float:left; margin-top: -61.5%; " src="templates/default/images/cccc_03.png" />
			</a>
			<div style="clear: both;"></div>
			<p style="position: relative; z-index: 18;padding-left: 20px;margin-top: -35px;">
				<img src="<?php echo APP_TEMPLATES_URL;?>/images/find_06-10.png"><label style="color: #FFFFFF;"><%=article_list[i].article_click%></label>
			</p>
		</td>
	</tr>
	<% }
	}%>
</script>


<script type="application/javascript">
	mui('body').on('tap','a',function(){document.location.href=this.href;});
	var curpage = 1;
	var totalPage = <?php echo $output['totalPage']; ?>;
	mui.init({
		pullRefresh: {
			container: '#pullrefresh',
			up: {
				contentrefresh: '正在加载...',
				callback: pullupRefresh
			}
		}
	});
	var count = 0;
	/**
	 * 上拉加载具体业务实现
	 */
	function pullupRefresh() {
		setTimeout(function() {
			mui('#pullrefresh').pullRefresh().endPullupToRefresh((totalPage<=curpage)); //参数为true代表没有更多数据了。
			if(totalPage>curpage) {
				$.getJSON("index.php?act=find&op=indexPage&curpage=" + curpage, function (e) {
					curpage = e.datas.curpage;
					$("#find_list").append(template.render("record-list", e.datas));
				});
			}
		}, 1500);
	}

</script>
	</body>

</html>